document.addEventListener('DOMContentLoaded', function () {
  const mapContainer = document.getElementById('mapContainer');
  const campusMap = document.getElementById('campusMap');
  const markers = document.querySelectorAll('.marker');
  const infoWindow = document.getElementById('infoWindow');
  const infoTitle = document.getElementById('infoTitle');
  const infoDesc = document.getElementById('infoDesc');
  const closeInfo = document.getElementById('closeInfo');
  const viewDetails = document.getElementById('viewDetails');
  const zoomIn = document.getElementById('zoomIn');
  const zoomOut = document.getElementById('zoomOut');
  const resetBtn = document.getElementById('reset');
  const locationSelect = document.getElementById('locationSelect');

  let scale = 1;
  let isDragging = false;
  let startX, startY, startScrollLeft, startScrollTop;
  let currentLocation = null;

  // 地点信息 - 扩展了更多详情
  const locationInfo = {
    zhongMen: {
      title: '中门',
      desc: '学校的主要出入口之一，交通便利，靠近校园主干道。',
      fullDesc: '中门是湖北理工学院的主要出入口之一，位于校园的中心位置，交通十分便利。门口设有保安亭和门禁系统，保障校园安全。中门周边有公交线路经过，方便师生出行。校门采用现代设计风格，体现了学校的活力与朝气。',
      features: [
        '24小时安保服务',
        '门禁系统',
        '公交站点近',
        '校园导视图'
      ],
      image: 'img/zhongmen.jpg'
    },
    dongMen: {
      title: '东门',
      desc: '东门周边有较多商铺，方便师生日常购物和出行。',
      fullDesc: '东门是湖北理工学院的重要出入口，周边商业设施齐全，有超市、餐馆、书店等各类商铺，极大地方便了师生的日常生活。东门距离学生宿舍区较近，是学生日常出入校园的主要通道之一。',
      features: [
        '商业设施齐全',
        '靠近学生宿舍',
        '自行车停放区',
        '快递收发点'
      ],
      image: 'img/dongmen.jpg'
    },
    tiYuChang: {
      title: '田径场',
      desc: '同学们进行体育锻炼、举办运动会的重要场所。',
      fullDesc: '田径场是学校开展体育教学、训练和竞赛活动的重要场所，配备了标准400米塑胶跑道和草坪足球场。田径场周边还设有观众席，可容纳上千名观众，是学校举办运动会和大型户外活动的主要场地。每天早晚，许多师生会来此锻炼身体。',
      features: [
        '标准400米塑胶跑道',
        '草坪足球场',
        '观众席',
        '夜间照明系统'
      ],
      image: 'img/taiyuchang.jpg'
    },
    shuXingGongYu: {
      title: '疏馨公寓',
      desc: '学生公寓之一，为学生提供住宿服务，环境舒适。',
      fullDesc: '疏馨公寓是湖北理工学院的主要学生宿舍之一，建筑风格现代，内部设施完善。公寓内每间宿舍配备有床铺、书桌、衣柜和空调等基本生活设施，每层楼设有公共卫生间和淋浴间。公寓管理规范，环境整洁，为学生提供了舒适的居住环境。',
      features: [
        '4-6人间宿舍',
        '空调配备',
        '24小时热水',
        '自习区域'
      ],
      image: 'img/shuxing.jpg'
    },
    zhenXianGongYu: {
      title: '真贤公寓',
      desc: '学生公寓，配套设施齐全，方便学生生活起居。',
      fullDesc: '真贤公寓是学校较新的学生宿舍区，设施先进，配套齐全。公寓采用单元式布局，每个单元内设有独立卫生间和阳台，居住条件优越。公寓楼下设有自行车棚和休闲区，为学生提供便利。真贤公寓靠近食堂和教学楼，地理位置便利。',
      features: [
        '单元式布局',
        '独立卫生间',
        '阳台',
        '楼下休闲区'
      ],
      image: 'img/zhenxian.jpg'
    },
    canTing: {
      title: '食堂',
      desc: '提供丰富多样的餐饮选择，满足师生不同口味需求。',
      fullDesc: '学校食堂是师生就餐的主要场所，内部环境整洁，就餐面积宽敞。食堂提供早、中、晚三餐，菜品丰富多样，涵盖了不同风味和价位的选择，能够满足师生的多样化需求。食堂严格执行食品安全标准，确保饮食卫生。',
      features: [
        '多种风味窗口',
        '卫生标准高',
        '价格实惠',
        '就餐环境舒适'
      ],
      image: 'img/canting.jpg'
    },
    tiJian: {
      title: '体检中心',
      desc: '学校组织师生体检的地点，关注师生身体健康。',
      fullDesc: '体检中心是学校为保障师生身体健康而设立的专门机构，配备了专业的医疗设备和医护人员。中心定期组织学生和教职工进行体检，并建立健康档案。此外，体检中心还提供健康咨询和基础医疗服务，为师生的健康保驾护航。',
      features: [
        '专业医疗设备',
        '医护人员常驻',
        '健康档案管理',
        '健康咨询服务'
      ],
      image: 'img/tijian.jpg'
    },
    baoDaoRuKou: {
      title: '报到入口',
      desc: '新生报到时的主要入口，为新生入学提供引导服务。',
      fullDesc: '报到入口是学校为方便新生入学而设立的专门通道，主要用于新生报到期间引导新生及家长进入校园。在新生报到期间，此处会设置咨询台、引导牌和志愿者服务点，为新生提供报到流程指导、校园信息咨询等服务，帮助新生顺利完成入学手续。',
      features: [
        '新生引导服务',
        '咨询服务台',
        '行李寄存处',
        '志愿者服务'
      ],
      image: 'img/baodao.jpg'
    }
  };

  // 显示信息窗口
  function showInfoWindow(marker) {
    const location = marker.getAttribute('data-location');
    if (locationInfo[location]) {
      currentLocation = location;
      infoTitle.textContent = locationInfo[location].title;
      infoDesc.textContent = locationInfo[location].desc;

      // 计算信息窗口位置，避免超出容器
      const rect = marker.getBoundingClientRect();
      const containerRect = mapContainer.getBoundingClientRect();
      
      let leftPos = rect.left - containerRect.left + 10;
      let topPos = rect.top - containerRect.top + 30;
      
      // 检查右侧边界
      if (leftPos + 280 > containerRect.width) {
        leftPos = rect.left - containerRect.left - 290;
      }
      
      // 检查底部边界
      if (topPos + 150 > containerRect.height) {
        topPos = rect.top - containerRect.top - 160;
      }

      infoWindow.style.left = `${leftPos}px`;
      infoWindow.style.top = `${topPos}px`;
      infoWindow.style.display = 'block';
    }
  }

  // 隐藏信息窗口
  function hideInfoWindow() {
    infoWindow.style.display = 'none';
    currentLocation = null;
  }

  // 跳转到详情页
  function goToDetails() {
    if (currentLocation) {
      // 将当前地点信息存储到localStorage，供详情页使用
      localStorage.setItem('currentLocation', JSON.stringify(locationInfo[currentLocation]));
      localStorage.setItem('locationId', currentLocation);
      window.location.href = 'detail.html';
    }
  }

  // 标记点点击事件
  markers.forEach(marker => {
    marker.addEventListener('click', function (e) {
      e.stopPropagation();
      showInfoWindow(this);
    });
  });

  // 关闭信息窗口
  closeInfo.addEventListener('click', hideInfoWindow);

  // 查看详情
  viewDetails.addEventListener('click', goToDetails);

  // 地图容器点击事件（隐藏信息窗口）
  mapContainer.addEventListener('click', hideInfoWindow);

  // 放大
  zoomIn.addEventListener('click', function () {
    scale += 0.1;
    campusMap.style.transform = `scale(${scale})`;
  });

  // 缩小
  zoomOut.addEventListener('click', function () {
    if (scale > 0.5) {
      scale -= 0.1;
      campusMap.style.transform = `scale(${scale})`;
    }
  });

  // 重置
  resetBtn.addEventListener('click', function () {
    scale = 1;
    campusMap.style.transform = 'scale(1)';
    mapContainer.scrollLeft = 0;
    mapContainer.scrollTop = 0;
  });

  // 选择地点
  locationSelect.addEventListener('change', function () {
    const selectedValue = this.value;
    if (selectedValue) {
      const marker = document.querySelector(`.marker[data-location="${selectedValue}"]`);
      if (marker) {
        showInfoWindow(marker);
      }
    }
  });

  // 拖拽功能
  campusMap.addEventListener('mousedown', function (e) {
    isDragging = true;
    startX = e.clientX;
    startY = e.clientY;
    startScrollLeft = mapContainer.scrollLeft;
    startScrollTop = mapContainer.scrollTop;
    mapContainer.style.cursor = 'grabbing';
    hideInfoWindow(); // 拖拽时隐藏信息窗口
  });

  document.addEventListener('mousemove', function (e) {
    if (!isDragging) return;
    e.preventDefault();
    const x = e.clientX - startX;
    const y = e.clientY - startY;
    mapContainer.scrollLeft = startScrollLeft - x;
    mapContainer.scrollTop = startScrollTop - y;
  });

  document.addEventListener('mouseup', function () {
    isDragging = false;
    mapContainer.style.cursor = 'grab';
  });

  mapContainer.addEventListener('mouseenter', function () {
    if (!isDragging) {
      mapContainer.style.cursor = 'grab';
    }
  });

  mapContainer.addEventListener('mouseleave', function () {
    mapContainer.style.cursor = 'default';
  });
});
